<template>
    <div class="">
        <h2>子组件</h2>
        <p>{{ fMsg }}</p>
        <button @click="sendSMsg">传递数据到父组件</button>
    </div>
</template>

<script setup>
import { defineProps, defineEmits, ref } from 'vue'
// 使用defineProps接受父组件的数据,然后再模板中可以使用
defineProps({
    fMsg: String
})

let sMsg = ref('子组件的数据');
let emit = defineEmits(['sendSMsgEvent']);

let sendSMsg = () => {
    // 通过emit触发事件
    // 第一参数:事件名,第二个参数:传递数据
    emit('sendSMsgEvent', sMsg.value)
}

</script>

<style lang="less" scoped>

</style>
